<template>
    <h2>子组件</h2>
    <button @click="modelOpen = true">打开一个对话框</button>

    <!-- 对话框代码-->
    <Teleport to="body"> <!-- 可以显示的标签到哪个标签下 -->
        <div v-if="modelOpen">
            <div>这是对话框</div>
            <button @click="modelOpen =  false">关闭对话框</button>
        </div>
    </Teleport>
</template>

<script lang="ts">

import {defineComponent, reactive, ref} from "vue";


export default defineComponent({
    name: "Child",
    setup() {
        let modelOpen = ref(false)
        return {
            modelOpen
        }
    }
});
</script>

<style scoped>

</style>